import React from 'react'
import {Button} from 'antd'
import CheckboxGroup from './CheckboxGroup'
import Checkbox from './Checkbox'
import reqwest from 'reqwest'

class Editor extends React.Component{
    constructor(props){
        super(props)
        this.state = {
            checkboxArr:[]
        }
    }
    componentDidMount(){
        reqwest({
            url:'http://admin.mapboom.cn/auth/v1.0/service/list',
            method: 'get',
            type: 'json',
          }).then((data) => {
            console.log(data)
            const arr =[]
            data.data.map((item)=>{
                arr.push(item.service_name)
            })
            this.setState({
                checkboxArr:data.data,
                checkboxGroup:arr
            })
          });
    }
    CheckboxChange(key,checkboxList){
       this.state[key] = checkboxList
    }
    getChecked(){
        const arr = this.state.checkboxGroup;
        let checkedArr =[];
        arr.map(item =>{
            if(this.state[item] && this.state[item].length>0){
                checkedArr = checkedArr.concat(this.state[item])
            }
                
        })
        console.log(checkedArr)
    }
    render(){
        return (
            <div>
                {
                    this.state.checkboxArr.map((item,index) =>{
                        return <CheckboxGroup onChange={this.CheckboxChange.bind(this)} key={index} checkboxArr={item}  />
                    })
                }

                <Button onClick={this.getChecked.bind(this)}>保存</Button>
            </div>
        )
    }
}

export default Editor